﻿@model MobileDesigner.Models.ProjectMapModel
@section ConstructorScript
{
    <script src="~/Scripts/jquery.fileupload.js"></script>
    <script src="~/Scripts/jquery.iframe-transport.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {

            initAutoFileUpload();

            $("#AddSection").accordion({
                collapsible: true,
                active: false
            });

            $("#SaveProject").click(function () {
                $.ajax({
                    url: '/Project/Save',
                    type: 'POST',
                    contentType: 'application/json; charset=utf-8',
                    dataType: 'json',
                    data: JSON.stringify({
                        Name: "@Model.Name",
                        Description: "@Model.Description",
                        Pages: [
                            { Name: "MainPage", Enabled: ($("#appSections").has("#MainPage").length > 0) ? true : false, Label: "Главная страница" },
                            { Name: "BottomMenu", Enabled: ($("#appSections").has("#BottomMenu").length > 0) ? true : false, Label: "Нижнее меню" },
                            { Name: "TopMenu", Enabled: ($("#appSections").has("#TopMenu").length > 0) ? true : false, Label: "Верхнее меню" },
                            { Name: "Info", Enabled: ($("#appSections").has("#Info").length > 0) ? true : false, Label: "Дополнительная информация" },
                            { Name: "Catalogue", Enabled: ($("#appSections").has("#Catalogue").length > 0) ? true : false, Label: "Каталог товаров" },
                            { Name: "Page", Enabled: ($("#appSections").has("#Page").length > 0) ? true : false, Label: "Новая страница" },
                            { Name: "News", Enabled: ($("#appSections").has("#News").length > 0) ? true : false, Label: "Новости и акции" },
                            { Name: "Address", Enabled: ($("#appSections").has("#Address").length > 0) ? true : false, Label: "Адреса" },
                            { Name: "Call", Enabled: ($("#appSections").has("#Call").length > 0) ? true : false, Label: "Позвонить" },
                            { Name: "Novelty", Enabled: ($("#appSections").has("#Novelty").length > 0) ? true : false, Label: "Новинки" },
                            { Name: "Search", Enabled: ($("#appSections").has("#Search").length > 0) ? true : false, Label: "Поиск" },
                            { Name: "Sale", Enabled: ($("#appSections").has("#Sale").length > 0) ? true : false, Label: "Распродажа" },
                            { Name: "PhotoGallery", Enabled: ($("#appSections").has("#PhotoGallery").length > 0) ? true : false, Label: "Фотогалерея" },
                            { Name: "Ask", Enabled: ($("#appSections").has("#Ask").length > 0) ? true : false, Label: "Заявка" },
                            { Name: "Social", Enabled: ($("#appSections").has("#Social").length > 0) ? true : false, Label: "Соц. сети" },
                            { Name: "Bonuses", Enabled: ($("#appSections").has("#Bonuses").length > 0) ? true : false, Label: "Бонусы" },
                            { Name: "Promo", Enabled: ($("#appSections").has("#Promo").length > 0) ? true : false, Label: "Промо код" }
                        ]
                    }),
                    success: function (json) {
                        if (json.isRedirect) {
                            window.location.href = json.redirectUrl;
                        }
                    },
                    error: function (xhr, ajaxOptions, thrownError) {
                        alert("Error while paging the server to abort.  Reported error: '" + xhr.responseText + "'.");
                    }
                });
            });

            $("#PagesToAdd li").click(function () {
                switch ($(this).attr("id")) {
                    case "Page":
                        $("#appSections").append('<li id="Page">Новая страница</li>')
                        break;
                    case "News":
                        $("#appSections").append('<li id="News">Новости и акции</li>')
                        break;
                    case "Address":
                        $("#appSections").append('<li id="Address">Адреса</li>')
                        break;
                    case "Call":
                        $("#appSections").append('<li id="Call">Позвонить</li>')
                        break;
                    case "Novelty":
                        $("#appSections").append('<li id="Novelty">Новинки</li>')
                        break;
                    case "Search":
                        $("#appSections").append('<li id="Search">Поиск</li>')
                        break;
                    case "Sale":
                        $("#appSections").append('<li id="Sale">Распродажа</li>')
                        break;
                    case "PhotoGallery":
                        $("#appSections").append('<li id="PhotoGallery">Фотогалерея</li>')
                        break;
                    case "Ask":
                        $("#appSections").append('<li id="Ask">Заявка</li>')
                        break;
                    case "Social":
                        $("#appSections").append('<li id="Social">Соц. сети</li>')
                        break;
                    case "Bonuses":
                        $("#appSections").append('<li id="Bonuses">Бонусы</li>')
                        break;
                    case "Promo":
                        $("#appSections").append('<li id="Promo">Промо код</li>')
                        break;
                }
                $("#AddSection").accordion({ active: false });
            });

            $("#appSections li").click(function () {
                $(this).addClass("selected").siblings().removeClass("selected");
                $("#editor div").addClass("hide");
                switch ($(this).attr('id')) {
                    case "MainPage":
                        $("#MainPageImage").removeClass("hide");
                        $("#MainPageText").removeClass("hide");
                        $("#MainPageSlider").removeClass("hide");
                        break;
                    case "BottomMenu":
                        $("#BottomMenuButton").removeClass("hide");
                        $("#BottomMenuMore").removeClass("hide");
                        break;
                    case "TopMenu":
                        $("#TopMenuButton").removeClass("hide");
                        $("#TopMenuMore").removeClass("hide");
                        break;
                    case "Info":
                        $("#InfoPageImage").removeClass("hide");
                        break;
                    case "Catalogue":
                        $("#ServiceCatalogue").removeClass("hide");
                        $("#OnlineCatalogue").removeClass("hide");
                        break;
                    case "Page":
                        $("#NewPageImage").removeClass("hide");
                        $("#NewPageText").removeClass("hide");
                        $("#NewPageSlider").removeClass("hide");
                        break;
                    case "News":
                        break;
                    case "Address":
                        break;
                    case "Call":
                        break;
                    case "Novelty":
                        break;
                    case "Search":
                        break;
                    case "Sale":
                        break;
                    case "PhotoGallery":
                        break;
                    case "Ask":
                        break;
                    case "Social":
                        break;
                    case "Bonuses":
                        break;
                    case "Promo":
                        break;
                }
            });
        });

        function initAutoFileUpload() {
            'use strict';
            
            $('#main-image').fileupload({
                autoUpload: true,
                url: '/Project/UploadFile',
                dataType: 'json',
                add: function (e, data) {
                    var jqXHR = data.submit()
                        .success(function (data, textStatus, jqXHR) {
                            if (data.isUploaded) {
                                
                            }
                            else {
                                alert(data.message);
                            }
                        })
                        .error(function (data, textStatus, errorThrown) {
                            if (typeof (data) != 'undefined' || typeof (textStatus) != 'undefined' || typeof (errorThrown) != 'undefined') {
                                alert(textStatus + errorThrown + data);
                            }
                        });
                },
                fail: function (event, data) {
                    if (data.files[0].error) {
                        alert(data.files[0].error);
                    }
                }
            });
        }
    </script>
}

@{
    ViewBag.Title = "Index";
}
<input type="submit" value="Сохранить" id="SaveProject" />
<div id="constructor">
    <div id="sectionsSelection">
        <h6>Разделы</h6>
        <div id="AddSection">
            <span>Добавить раздел</span>
            <div>
                <ul id="PagesToAdd">
                    @foreach (var item in Model.Pages)
                    {
                        if (!item.Enabled)
                        {
                        <li id="@item.Name">@item.Label</li>
                        }
                    }
                </ul>
            </div>
        </div>
        <ul id="appSections">
            @foreach (var item in Model.Pages)
            {
                if (item.Enabled)
                {
                <li id="@item.Name">@item.Label</li>
                }
            }
        </ul>
    </div>
    <div id="viewer">
        <img id="mainImage" src="@String.Empty"/>
    </div>
    <div id="editor">
        <div id="MainPageImage" class="hide">
            <input type="file" id="main-image"  name="MainImage"/>
        </div>
        <div id="MainPageText" class="hide">
            PageText
        </div>
        <div id="MainPageSlider" class="hide">
            PageSlider
        </div>
        <div id="BottomMenuButton" class="hide">
            MenuButton
        </div>
        <div id="BottomMenuMore" class="hide">
            MenuMore
        </div>
        <div id="TopMenuButton" class="hide">
            MenuButton
        </div>
        <div id="TopMenuMore" class="hide">
            MenuMore
        </div>
        <div id="AppIcon" class="hide">
            AppIcon
        </div>
        <div id="AppName" class="hide">
            AppName
        </div>
        <div id="OnlineCatalogue" class="hide">
            OnlineCatalogue
        </div>
        <div id="ServiceCatalogue" class="hide">
            ServiceCatalogue
        </div>
        <div id="InfoPageImage" class="hide">
            InfoPageImage
        </div>
        <div id="NewPageImage" class="hide">
            NewPageImage
        </div>
        <div id="NewPageText" class="hide">
            NewPageText
        </div>
        <div id="NewPageSlider" class="hide">
            NewPageSlider
        </div>
    </div>
</div>

